<style type="text/css">

.F4{
	border:0px solid #000000;
	float:left;
	width:100%;
}

.F4_div{
	float:left;
	border:1px solid #f8f9fb;/* #f8f9fb */
	background-color:#f8f9fb!important;
	width: 100%;
	text-align: center;
}

.F4div_saydiv{
	/* display:inline-block;
	border:1px solid #000000;
	margin:0 auto;
	margin-top:26px;
	margin-bottom:26px;
	width:33%; */
}

.jobs_img{
	display:inline-block;
	margin-top:50px;
	width: 150px;
	margin-bottom: 5%;
}

.say_txt2{
	float:left;
	color: #717882;
	font-size: 25px;
	margin-left:8%;
	letter-spacing:3px;
	margin-top:60px;
}

.say_txt1{
	float:left;
	color: #69707B;
	font-weight: bold;
	font-size: 18px;
	margin-left:2%;
	margin-top:30px;
}

.say_txt3{
	float:left;
	color: #717882;
	font-size: 25px;
	margin-left:15%;
	letter-spacing:3px;
}

.say_div{
	border:0px solid #000000;
	display: inline-block;
	width:460px;
	height:100px;
}

.F4div2_bgimg{
	float:left;
	background:url("${ctx}/themes/default/img/bg-purchase.png");
	width:100%;
	border:0px solid #000000;
	background-attachment:fixed;
	text-align: center;
}

.F4_div2{
	border:1px solid #000000;
	width: 15%;
	height: 30%;
	margin:0 auto;
	margin-top:5%;
	text-align: center;
}

.F4_txt1{
	font-weight: 700;
	font-size: 38px;
	display: inline-block;
	margin-top:50px;
}

.F4_txt2{
	font-weight: 200;
	font-size: 38px;
	margin-top:50px;
}

.F4_btn{
	margin:0 auto;
	margin-top:60px;
	margin-bottom:50px;
}

@media screen and (max-width: 767px){
	.say_div{
		border:0px solid #000000;
		display:block;
		margin:0 auto;
		width:380px;
	}
	
	.say_txt1{
		margin-top:0px;
	}
	
	.say_txt2{
		font-size: 25px;
		margin-left:6%;
		margin-top:0px;
	}
	
	.say_txt3{
		font-size: 20px;
	}
}

@media screen and (max-width: 383px){
	.say_div{
		width:320px;
	}
	
	.say_txt2{
		font-size: 19px;
	}
	
	.say_txt3{
		font-size: 15px;
	}
}

@media screen and (max-width: 320px){
	.say_div{
		width:100%;
	}
}

/* @media screen and (max-width: 616px){
	.jobs_img{
		width: 120px;
	}
	
	.say_div{
		border:1px solid #000000;
		width:380px;
	}
	
	.say_txt2{
		font-size: 20px;
		margin-left:2%;
		margin-top:60px;
	}
	
	.say_txt3{
		font-size: 20px;
	}
} */


/* @media screen and (max-width: 616px){
	.jobs_img{
		width: 150px;
	}
	
	.say_div{
		border:0px solid #000000;
		display: inline-block;
		width:260px;
		height:200px;
	}
	
	.say_txt1{
		margin-top:0px;
	}
	
	.say_txt2{
		font-size: 25px;
		margin-left:8%;
		margin-top:10px;
	}
	
	.say_txt3{
		font-size: 15px;
	}
	
	
} */


</style>

<div class="F4">
	<div class="F4_div">
		<div class="F4div_saydiv">
			<img class="am-radius jobs_img" src="${ctx}/themes/default/img/Jobs.jpg"/>
			<div class="say_div">
				<p class="say_txt1">saying:</p>
				<p class="say_txt2">stay hungry! stay foolish!</p>
				<p class="say_txt3">--保持饥饿！保持愚蠢！</p>
			</div>
		</div>
	</div>
	
	<div class="F4div2_bgimg">
		<div data-am-scrollspy="{animation:'slide-bottom',delay: 0,repeat: false}">
		 	<span class="F4_txt1">心动</span>
			<span class="F4_txt2">了吗？</span></br>
			<button type="button" class="am-btn am-btn-success am-round F4_btn">立即加入！</button>
		</div>
	</div>
</div>

<script type="text/javascript">

</script>